<template>
  <div class="inCareAssessment">
    <div v-if="type === '打印'" class="mask"></div>
    <div class="header">
      <div class="title">{{ hospitalName }}</div>
      <div class="title" style="margin-top: 6px">{{ title }}</div>
    </div>
    <div class="form">
      <!-- 基础信息 -->
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">病区：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input :value="pageData.wardName" type="text" disabled />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">床号：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input :value="pageData.bedNumber" type="text" disabled />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">住院号：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input :value="pageData.hospitalNumber" type="text" disabled />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">评估时间：</div>
          <div class="formContent">
            <DateSelection
              v-model="pageData.createTime"
              :simple-op="true"
              :date-picker-show="true"
              :date-show="true"
              :no-clear="true"
              class="timePicker"
            />
          </div>
        </div>
      </div>
      <!-- 一般资料 -->
      <div class="formRow"><div class="formTitle">一、一般资料</div></div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">姓名：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input :value="pageData.patientName" type="text" disabled />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">性别：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input :value="gender(pageData.gender)" type="text" disabled />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">年龄：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input :value="pageData.age" type="text" disabled />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">婚姻：</div>
          <div class="formContent">
            <select v-model="pageData.marriage" class="select w-100">
              <option
                v-for="(item, index) in dicts.marriage"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">民族：</div>
          <div class="formContent">
            <select v-model="pageData.nation" class="select w-100">
              <option
                v-for="(item, index) in dicts.nation"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">职业：</div>
          <div class="formContent">
            <select v-model="pageData.occupation" class="select w-200">
              <option
                v-for="(item, index) in dicts.occupation"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">宗教信仰：</div>
          <div class="formContent">
            <select v-model="pageData.religiousFaith" class="select w-100">
              <option
                v-for="(item, index) in dicts.religiousFaith"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">社会支持：</div>
          <div class="formContent">
            <select v-model="pageData.socialSupport" class="select w-100">
              <option
                v-for="(item, index) in dicts.socialSupport"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">文化程度：</div>
          <div class="formContent">
            <select v-model="pageData.educationLevel" class="select w-100">
              <option
                v-for="(item, index) in dicts.educationLevel"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">家庭成员关系：</div>
          <div class="formContent">
            <select v-model="pageData.familyRelation" class="select w-100">
              <option
                v-for="(item, index) in dicts.familyRelation"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">联系人（关系）：</div>
          <div class="formContent">
            <select v-model="pageData.contacts" class="select w-100">
              <option
                v-for="(item, index) in dicts.contacts"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">联系电话：</div>
          <div class="formContent">
            <div class="inputText w-150">
              <input v-model="pageData.phoneNumber" type="text" />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">家庭地址：</div>
          <div class="formContent">
            <div class="inputText w-500">
              <input v-model="pageData.address" type="text" />
            </div>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">入院日期：</div>
          <div class="formContent">
            <DateSelection
              v-model="pageData.ryTime"
              :simple-op="true"
              :date-picker-show="true"
              :date-show="true"
              :no-clear="true"
              class="timePicker"
            />
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">入院方式：</div>
          <div class="formContent">
            <select v-model="pageData.admissionForm" class="select w-100">
              <option
                v-for="(item, index) in dicts.admissionForm"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">医疗费用：</div>
          <div class="formContent">
            <select v-model="pageData.medicalExpense" class="select w-100">
              <option
                v-for="(item, index) in dicts.medicalExpense"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">发病节气：</div>
          <div class="formContent">
            <el-autocomplete
              v-model="pageData.solarTerms"
              :fetch-suggestions="
                (queryString, cb) => querySearch('solarTerms', queryString, cb)
              "
              class="w-100"
            ></el-autocomplete>
            <div class="inputText w-100" style="margin-left: 6px">
              <input v-model="pageData.solarTermsContent" type="text" />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">疾病的认知：</div>
          <div class="formContent">
            <select v-model="pageData.cognition" class="select w-100">
              <option
                v-for="(item, index) in dicts.cognition"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem w-100"></div>
      </div>
      <div class="formRow">
        <div class="formItem" style="width: 100%">
          <div class="formLabel">过敏史：</div>
          <div class="formContent" style="width: 100%">
            <div class="inputText" style="width: 100%">
              <input v-model="pageData.allergyHistory" type="text" />
            </div>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem" style="width: 100%">
          <div class="formLabel">既往史：</div>
          <div class="formContent" style="width: 100%; flex-wrap: nowrap">
            <div class="inputRadio" style="flex-shrink: 0">
              <span
                class="inputRadio_inner"
                :class="{ checked: pageData.previousHistory === '无' }"
              >
                <input
                  :id="`pastHistory_${idx}_2`"
                  v-model="pageData.previousHistory"
                  type="radio"
                  :name="`pastHistory_${idx}`"
                  value="无"
                  :checked="pageData.previousHistory === '无'"
                />
              </span>
              <label :for="`pastHistory_${idx}_2`">无</label>
            </div>
            <div class="inputRadio" style="width: 100%; margin-left: 30px">
              <span
                class="inputRadio_inner"
                :class="{ checked: pageData.previousHistory === '有' }"
              >
                <input
                  :id="`pastHistory_${idx}_1`"
                  v-model="pageData.previousHistory"
                  type="radio"
                  :name="`pastHistory_${idx}`"
                  value="有"
                  :checked="pageData.previousHistory === '有'"
                />
              </span>
              <label :for="`pastHistory_${idx}_1`">有</label>
              <div class="inputText" style="width: 100%; margin-left: 10px">
                <input
                  v-model="pageData.previousHistoryContent"
                  type="text"
                  :disabled="pageData.previousHistory !== '有'"
                />
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">主证：</div>
          <div class="formContent">
            <div class="inputText w-300">
              <input v-model="pageData.mainEvidence" type="text" />
            </div>
          </div>
        </div>
      </div>
      <div class="formRow">
        <div class="formItem" style="width: 100%">
          <div class="formLabel">入院诊断：</div>
          <div class="formContent" style="width: 100%">
            <div class="formItem">
              <div class="formLabel">中医：</div>
              <div class="formContent">
                <div class="inputText w-100">
                  <input v-model="pageData.chineseMedical" type="text" />
                </div>
              </div>
            </div>
            <div class="formItem" style="margin-left: 50px">
              <div class="formLabel">证型：</div>
              <div class="formContent">
                <div class="inputText w-100">
                  <input v-model="pageData.evidenceType" type="text" />
                </div>
              </div>
            </div>
            <div class="formItem" style="width: 100%; margin-top: 10px">
              <div class="formLabel">西医：</div>
              <div class="formContent" style="width: 100%">
                <div class="inputText" style="width: 100%">
                  <input v-model="pageData.westMedical" type="text" />
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 二、四诊检查 -->
      <div class="formRow"><div class="formTitle">二、四诊检查</div></div>
      <div class="formRow">
        <div class="formItem">
          <div class="formLabel">体温：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input v-model="pageData.temperature" type="text" />
              <span class="append">℃</span>
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">脉搏：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input v-model="pageData.pulse" type="text" />
              <span class="append">次/分</span>
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">呼吸：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input v-model="pageData.respire" type="text" />
              <span class="append">次/分</span>
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">血压：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input v-model="pageData.bloodPressure" type="text" />
              <span class="append">mmHg</span>
            </div>
          </div>
        </div>
      </div>
      <!-- （一）望诊 -->
      <div class="formRow">（一）望诊</div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">望神：</div>
          <div class="formContent">
            <select v-model="pageData.seeExpression" class="select w-150">
              <option
                v-for="(item, index) in dicts.seeExpression"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">面色：</div>
          <div class="formContent">
            <select v-model="pageData.complexion" class="select w-150">
              <option
                v-for="(item, index) in dicts.complexion"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">形态：</div>
          <div class="formContent">
            <select v-model="pageData.activity" class="select w-150">
              <option
                v-for="(item, index) in dicts.activity"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">舌质：</div>
          <div class="formContent">
            <select v-model="pageData.tongueNature" class="select w-150">
              <option
                v-for="(item, index) in dicts.tongueNature"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">舌苔：</div>
          <div class="formContent">
            <select v-model="pageData.tongue" class="select w-150">
              <option
                v-for="(item, index) in dicts.tongue"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">皮肤：</div>
          <div class="formContent">
            <select v-model="pageData.skin" class="select w-150">
              <option
                v-for="(item, index) in dicts.skin"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">水肿：</div>
          <div class="formContent">
            <select v-model="pageData.edema" class="select w-150">
              <option
                v-for="(item, index) in dicts.edema"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">导管：</div>
          <div class="formContent">
            <select v-model="pageData.pipe" class="select w-150">
              <option
                v-for="(item, index) in dicts.pipe"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">VTE评分：</div>
          <div class="formContent">
            <div class="inputText w-150">
              <input v-model="pageData.vteEval" type="text" />
            </div>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">Barthel评分：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input v-model="pageData.barthelEval" type="text" />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">坠床跌倒风险评分：</div>
          <div class="formContent">
            <div class="inputText w-100">
              <input v-model="pageData.fallEval" type="text" />
            </div>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">Braden评分：</div>
          <div class="formContent">
            <div class="inputText w-150">
              <input v-model="pageData.bradenEval" type="text" />
            </div>
          </div>
        </div>
      </div>
      <!-- （二）闻诊 -->
      <div class="formRow">（二）闻诊</div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">声音：</div>
          <div class="formContent">
            <select v-model="pageData.voice" class="select w-150">
              <option
                v-for="(item, index) in dicts.voice"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">呼吸：</div>
          <div class="formContent">
            <select v-model="pageData.breathe" class="select w-150">
              <option
                v-for="(item, index) in dicts.breathe"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">气味：</div>
          <div class="formContent">
            <select v-model="pageData.smell" class="select w-150">
              <option
                v-for="(item, index) in dicts.smell"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">咳嗽：</div>
          <div class="formContent">
            <select v-model="pageData.cough" class="select w-150">
              <option
                v-for="(item, index) in dicts.cough"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem" style="width: auto">
          <div class="formLabel">咳痰：</div>
          <div class="formContent">
            <select v-model="pageData.expectoration" class="select w-50">
              <option
                v-for="(item, index) in dicts.expectoration"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
            <select
              v-model="pageData.expectorationColor"
              class="select w-100"
              style="margin-left: 6px"
            >
              <option
                v-for="(item, index) in dicts.expectorationColor"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
            <select
              v-model="pageData.expectorationNature"
              class="select w-100"
              style="margin-left: 6px"
            >
              <option
                v-for="(item, index) in dicts.expectorationNature"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <!-- （三）问诊 -->
      <div class="formRow">（三）问诊</div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">寒热：</div>
          <div class="formContent">
            <select v-model="pageData.fever" class="select w-150">
              <option
                v-for="(item, index) in dicts.fever"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">饮食：</div>
          <div class="formContent">
            <select v-model="pageData.diet" class="select w-150">
              <option
                v-for="(item, index) in dicts.diet"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">睡眠：</div>
          <div class="formContent">
            <select v-model="pageData.sleep" class="select w-150">
              <option
                v-for="(item, index) in dicts.sleep"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">情志：</div>
          <div class="formContent">
            <select v-model="pageData.emotion" class="select w-150">
              <option
                v-for="(item, index) in dicts.emotion"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">疼痛：</div>
          <div class="formContent">
            <select v-model="pageData.pain" class="select w-150">
              <option
                v-for="(item, index) in dicts.pain"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">疼痛评分：</div>
          <div class="formContent">
            <div class="inputText w-150">
              <input v-model="pageData.painEval" type="text" />
            </div>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">听力：</div>
          <div class="formContent">
            <select v-model="pageData.hearing" class="select w-150">
              <option
                v-for="(item, index) in dicts.hearing"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">口渴：</div>
          <div class="formContent">
            <select v-model="pageData.thirsty" class="select w-150">
              <option
                v-for="(item, index) in dicts.thirsty"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel w-100">小便：</div>
          <div class="formContent">
            <select v-model="pageData.urinate" class="select w-150">
              <option
                v-for="(item, index) in dicts.urinate"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">大便：</div>
          <div class="formContent">
            <select v-model="pageData.stool" class="select w-150">
              <option
                v-for="(item, index) in dicts.stool"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <!-- （四）切诊 -->
      <div class="formRow">（四）切诊</div>
      <div class="formRow fourCheck">
        <div class="formItem">
          <div class="formLabel">脉象：</div>
          <div class="formContent">
            <select v-model="pageData.pulseCondition" class="select w-150">
              <option
                v-for="(item, index) in dicts.pulseCondition"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
        <div class="formItem">
          <div class="formLabel">腕腹：</div>
          <div class="formContent">
            <select v-model="pageData.carpal" class="select w-150">
              <option
                v-for="(item, index) in dicts.carpal"
                :key="index"
                :value="item.value"
              >
                {{ item.label }}
              </option>
            </select>
          </div>
        </div>
      </div>
      <!-- （五）其他异常体征 -->
      <div class="formRow">（五）其他异常体征</div>
      <div class="formRow">
        <el-input
          v-model="pageData.other"
          type="textarea"
          resize="none"
          :rows="3"
          class="textarea"
        ></el-input>
      </div>
    </div>
    <div class="footer">
      <div class="sign">
        责任护士签名：
        <div class="inputText w-150">
          <input v-model="pageData.nurseSign" type="text" />
        </div>
      </div>
      <div class="sign">
        护士长签名：
        <div class="inputText w-150">
          <input v-model="pageData.nurseLeaderSign" type="text" />
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { format } from 'date-fns'
import { cloneDeep } from 'lodash-unified'
import {
  computed,
  defineComponent,
  nextTick,
  reactive,
  set,
  toRefs,
  watch
} from 'vue'

import DateSelection from '@/components/DateSelection/indexV2.vue'
import { getStoreFromInstance } from '@/utils/instance'

import { baseData, dicts } from './baseData.js'

export default defineComponent({
  components: {
    DateSelection
  },
  props: {
    data: {
      type: Object,
      default: () => ({})
    },
    formType: {
      type: String,
      default: 'add'
    },
    type: {
      type: String,
      default: ''
    },
    idx: {
      type: Number,
      default: 0
    },
    title: {
      type: String,
      default: ''
    }
  },
  setup(props) {
    const state = reactive({
      dicts,
      pageData: {},
      hospitalName: window.hospitalName
    })

    const store = getStoreFromInstance()

    const patCur = computed(() => store.getters.patCur)

    const gender = computed(() => val => {
      if (val == 1) {
        return '男'
      } else if (val == 2) {
        return '女'
      }
      return '未知'
    })

    function initData() {
      console.log(props.type, props.formType)
      if (props.data.jsonText && props.data.jsonText !== '{}') {
        const jsonText = JSON.parse(props.data.jsonText)
        state.pageData = Object.assign(cloneDeep(baseData), jsonText)
      } else {
        state.pageData = cloneDeep(baseData)
        const needAutoFill = [
          'wardName',
          'bedNumber',
          'hospitalNumber',
          'patientName',
          'gender',
          'age'
        ]
        needAutoFill.forEach(v => {
          state.pageData[v] = patCur.value[v]
        })
        state.pageData.allergyHistory = patCur.value.gmList
          ?.map(v => v.gmyName)
          .join('，')
        state.pageData.createTime = +new Date()
        state.pageData.ryTime = patCur.value.ryInfo?.ryDate
      }
    }

    function getParams() {
      return state.pageData
    }

    function querySearch(code, queryString, cb) {
      const restaurants = state.dicts[code] || []
      const results = queryString
        ? restaurants.filter(createFilter(queryString))
        : restaurants
      // 调用 callback 返回建议列表的数据
      cb(results)
    }

    function createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) > -1
        )
      }
    }

    watch(
      () => props.data,
      () => {
        initData()
      },
      { immediate: true }
    )

    watch(
      () => state.pageData.previousHistory,
      val => {
        if (val === '无') {
          state.pageData.previousHistoryContent = ''
        }
      }
    )

    return {
      ...toRefs(state),
      patCur,
      gender,
      getParams,
      format,
      querySearch
    }
  }
})
</script>

<style lang="scss" scoped>
.mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
}

.header {
  padding: 10px 0;
  border-bottom: 1px solid #000;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 12px;

  .sign {
    display: flex;
    align-items: center;
    margin-left: 50px;
  }
}

.form {
  .formRow {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;

    &.fourCheck {
      justify-content: flex-start;

      .formItem {
        width: 33.3%;
      }
    }

    .formItem {
      display: flex;

      .formLabel {
        line-height: 28px;
        flex-shrink: 0;
        text-align: right;
      }

      .formContent {
        display: flex;
        flex-wrap: wrap;
      }
    }

    .formTitle {
      font-size: 16px;
      font-weight: bold;
    }
  }
}

.timePicker {
  width: 190px;
  padding: 0 6px 0 32px;
  height: 28px;
  line-height: 28px;
  border-radius: 0;
  border: 1px solid #aaa;
  outline: none;
}

.select {
  outline: none;
  border: 1px solid #aaa;
  height: 28px;
  line-height: 28px;
  border-radius: 0;
  padding: 0 6px;
}

.inputRadio {
  display: flex;
  align-items: center;

  .inputRadio_inner {
    border: 1px solid #aaa;
    width: 14px;
    height: 14px;
    flex-shrink: 0;

    &.checked {
      &::before {
        display: block;
        content: '✔';
        font-size: 14px;
        text-align: center;
        line-height: 14px;
      }
    }
  }

  label {
    font-weight: normal;
    margin-left: 6px;
    flex-shrink: 0;
  }

  input[type='radio'] {
    appearance: none;
    outline: none;
    border: 1px solid #aaa;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    opacity: 0;
  }
}

.inputText {
  display: flex;
  align-items: center;
  border: 1px solid #aaa;
  padding: 0 6px;

  input {
    appearance: none;
    width: 100%;
    height: 26px;
    line-height: 26px;
    outline: none;
    border: none;
    background: transparent;

    &:disabled {
      background: transparent;
      color: #000;
    }
  }

  .append {
    flex-shrink: 0;
    padding-left: 6px;
  }
}

:deep {
  .el-input__inner {
    border-radius: 0;
    border-color: #aaa;
    height: 28px;
    padding: 0 6px;
    color: #000;
    font-size: 14px;
  }

  .el-textarea__inner {
    border-radius: 0;
    color: #000;
    border-color: #aaa;
    font-size: 14px;
    padding: 6px;
  }
}

.w-50 {
  width: 50px;
}

.w-100 {
  width: 100px;
}

.w-150 {
  width: 150px;
}

.w-200 {
  width: 200px;
}

.w-300 {
  width: 300px;
}

.w-500 {
  width: 500px;
}

@media print {
  .inCareAssessment {
    .select {
      appearance: none;
    }
  }
}
</style>
